<!--系统管理 --- 组织机构 --- 用户管理 -->
<template>
  <div class="department">
    <!-- 左侧部门管理 -->
    <div class="structureTree" v-if="treelength">
      <div class="structureTree_title">
        <div>组织机构</div>
      </div>
      <!-- <el-tree
        ref="tree"
        :data="treeData"
        :props="defaultProps"
        @node-click="handleNodeClick"
        :highlight-current="highlightBd"
        node-key="fCompanyid"
        :accordion="true"
        :expand-on-click-node="false"
        :default-expanded-keys="expandedKeys"
              ></el-tree> -->
      <tree
        :treeData="treeData"
        :checkData="checkData"
        name="SysManageManage_treeCheck"
        nodeKey="fCompanyid"
        @getTreeInfo="handleNodeClick"
        :defaultProps="defaultProps"
      >
      </tree>
    </div>
    <!-- 右侧 -->
    <div class="department_right">
      <!-- 机构名称 -->
      <div class="department_right_name">
        <div>{{ showName }}--用户信息</div>
      </div>
      <!-- 顶部导航栏 -->
      <div class="mechanism_nav">
        <!-- 左侧 -->
        <div class="mechanism_nav_left left_select">
          <el-select
            v-model="departmentList.fDepartmentid"
            placeholder="请选择部门"
            @change="filterDepartment($event)"
          >
            <el-option
              v-for="(a, item) in departmentList"
              :key="item"
              :value="a.fDepartmentid"
              :label="a.fFullname"
            >
            </el-option>
          </el-select>
          <input
            type="text"
            placeholder="请输入关键字"
            v-model="queryCriteria.keyWord"
          />
          <el-button
            type="primary"
            icon="el-icon-search"
            size="small"
            @click="getDataList()"
            >查询</el-button
          >
        </div>
        <!-- 顶部按钮 -->
        <div class="print">
          <div class="printTable">
            <el-button
              type="primary"
              icon="el-icon-refresh"
              size="small"
              @click="getDataList()"
            ></el-button>
            <el-button
              v-if="lr_add"
              type="primary"
              icon="el-icon-circle-plus-outline"
              size="small"
              @click="newDetail(treeCompanyid)"
            >
              新增</el-button
            >
            <el-button
              v-if="lr_edit"
              type="primary"
              icon="el-icon-search"
              size="small"
              @click="editText(fUserid)"
              >编辑
            </el-button>
            <el-button
              v-if="lr_delete"
              type="primary"
              icon="el-icon-delete"
              size="small"
              @click="rowDelete(fUserid)"
              >删除
            </el-button>
          </div>
        </div>
      </div>

      <!-- 表格 -->
      <div class="mechanism_Table">
        <el-table
          ref="multipleTable"
          v-loading="loading"
          element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.2)"
          @row-click="getRowInfo"
          :data="tableData"
          style="width: 100%"
          :height="navigatepageNums > 1 ? 'calc(100% - 50px)' : '100%'"
          stripe
          border
          highlight-current-row
          @current-change="rowChange"
        >
          <el-table-column
            fixed
            type="index"
            :index="hIndex"
            width="50"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="fAccount"
            label="账户"
            width="90"
            align="center"
          >
            <!-- 超出鼠标滑过显示 -->
            <template slot-scope="scope">
              <div class="lineBoxhidden">
                <a href="javascript:;" :title="scope.row.fAccount">{{
                  scope.row.fAccount
                }}</a>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="fRealname"
            label="姓名"
            width="90"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="fGender"
            label="性别"
            width="80"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="fMobile"
            label="手机"
            width="120"
            align="center"
          >
          </el-table-column>
          <el-table-column
            prop="fDepartmentName"
            label="部门"
            width="180"
            align="center"
          >
            <template slot-scope="scope">
              <div class="lineBoxhidden">
                <a href="javascript:;" :title="scope.row.fDepartmentName">{{
                  scope.row.fDepartmentName
                }}</a>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="fPostname"
            label="岗位"
            width="180"
            align="center"
          >
            <template slot-scope="scope">
              <div class="lineBoxhidden">
                <a href="javascript:;" :title="scope.row.fPostname">{{
                  scope.row.fPostname
                }}</a>
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="fEnabledmark"
            label="状态"
            width="50"
            align="center"
          >
          </el-table-column>
          <el-table-column prop="fNote" label="备注" width="250">
            <template slot-scope="scope">
              <div class="lineBoxhidden">
                <a href="javascript:;" :title="scope.row.fNote">{{
                  scope.row.fNote
                }}</a>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <div class="block" v-if="navigatepageNums > 1">
          <div class="paginationInfo">
            检索到
            {{ queryCriteriaData.total }} 条记录 | 显示第
            <span v-if="queryCriteria.page == 1">{{ queryCriteria.page }}</span
            ><span v-else>{{ 20 * (queryCriteria.page - 1) }}</span>
            <!-- {{ 20 * queryCriteria.page }} 条记录 -->
            -
            <span v-if="queryCriteriaData.pages == queryCriteriaData.lastPage">
              {{ queryCriteriaData.total }}</span
            >
            <span v-else> {{ 20 * queryCriteria.page }} </span>
            条记录
          </div>
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="queryCriteria.page"
            :page-size="queryCriteria.pageSize"
            layout="prev, pager, next, jumper"
            :total="queryCriteriaData.total"
          >
          </el-pagination>
        </div>
      </div>

      <!--弹框 新增 -->
      <div class="Control-1 mechanism_dialog">
        <el-dialog
          :close-on-click-modal="false"
          title="添加用户"
          v-dialogDrag
          :visible.sync="dialogCheckVisible"
          v-loading="loadingCheckDialog"
          element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.2)"
        >
          <div class="dialogBody common" :style="{ height: dialogHeight }">
            <el-form
              :model="ruleForm"
              :rules="rules"
              ref="ruleForm"
              class="demo-ruleForm"
            >
              <div class="tableRow">
                <el-form-item
                  label="账户"
                  prop="fAccount"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fAccount"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="姓名"
                  prop="fRealname"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fRealname"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="密码"
                  prop="fPassword"
                  :label-width="formLabelWidth"
                >
                  <el-input
                   placeholder="请输入长度为6-12位密码"
                    type="password"
                    v-model="ruleForm.fPassword"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="部门"
                  prop="fDepartmentid"
                  :label-width="formLabelWidth"
                >
                  <el-select
                    v-model="ruleForm.fDepartmentid"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="(a, item) in departmentList"
                      :key="item"
                      :value="a.fDepartmentid"
                      :label="a.fFullname"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="工号"
                  prop="fEncode"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fEncode"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="岗位"
                  prop="fPostid"
                  :label-width="formLabelWidth"
                >
                  <el-select v-model="ruleForm.fPostid" placeholder="请选择">
                    <el-option
                      v-for="(a, item) in postList"
                      :key="item"
                      :value="a.fPostid"
                      :label="a.fPostname"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="生日"
                  prop="fBirthdays"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fBirthdays"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="性别"
                  prop="fGender"
                  :label-width="formLabelWidth"
                >
                  <el-select v-model="ruleForm.fGender" placeholder="请选择">
                    <el-option
                      v-for="(a, item) in gender"
                      :key="item"
                      :value="a.fGenderText"
                      :label="a.fGenderText"
                    >
                    </el-option>
                  </el-select>
                  <!-- <el-input
                    v-model="ruleForm.fGender"
                    autocomplete="off"
                                                                            ></el-input> -->
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="钉钉"
                  prop="fDing"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fDing"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="电话"
                  prop="fMobile"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fMobile"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="项目"
                  prop="fProjectid"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fProjectid"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="微信"
                  prop="fWechat"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fWechat"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
              </div>
              <div class="tableRow" style="margin-top: 10px">
                <el-form-item
                  label="备注"
                  prop="fNote"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="ruleForm.fNote"
                    type="textarea"
                    :rows="4"
                    placeholder="请输入内容"
                    autocomplete="off"
                  >
                  </el-input>
                </el-form-item>
              </div>
              <el-form-item class="newlyAdded_btn">
                <el-button type="primary" @click="submitForm('ruleForm')"
                  >保存</el-button
                >
                <el-button type="warning" @click="resetForm('ruleForm')"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>
          </div>
        </el-dialog>
      </div>
      <!--弹框 编辑 -->
      <div class="Control-1 mechanism_dialog">
        <el-dialog
          :close-on-click-modal="false"
          title="编辑用户信息"
          v-dialogDrag
          :visible.sync="dialogTableVisible"
          v-loading="loadingDialog"
          element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.2)"
        >
          <div class="dialogBody common" :style="{ height: dialogHeight }">
            <el-form :model="formData" :rules="rules1" ref="formData">
              <div class="tableRow">
                <el-form-item
                  label="账号"
                  prop="fAccount"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fAccount"
                    :disabled="prohibit"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="姓名"
                  prop="fRealname"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fRealname"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="密码"
                  prop="fPassword"
                  :label-width="formLabelWidth"
                >
                  <el-input
                   placeholder="请输入长度为6-12位密码"
                    :disabled="prohibit"
                    type="password"
                    v-model="formData.fPassword"
                    show-password
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="部门"
                  prop="fDepartmentid"
                  :label-width="formLabelWidth"
                >
                  <el-select
                    v-model="formData.fDepartmentid"
                    placeholder="请选择"
                  >
                    <el-option
                      v-for="(a, item) in departmentList"
                      :key="item"
                      :value="a.fDepartmentid"
                      :label="a.fFullname"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="工号"
                  prop="fEncode"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fEncode"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="岗位"
                  prop="fPostid"
                  :label-width="formLabelWidth"
                >
                  <el-select v-model="formData.fPostid" placeholder="请选择">
                    <el-option
                      v-for="(a, item) in postList"
                      :key="item"
                      :value="a.fPostid"
                      :label="a.fPostname"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="生日"
                  prop="fBirthdays"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fBirthdays"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="性别"
                  prop="fGender"
                  :label-width="formLabelWidth"
                >
                  <el-select v-model="formData.fGender" placeholder="请选择">
                    <el-option
                      v-for="(a, item) in gender"
                      :key="item"
                      :value="a.fGenderText"
                      :label="a.fGenderText"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="钉钉"
                  prop="fDing"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fDing"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="电话"
                  prop="fMobile"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fMobile"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
              </div>
              <div class="tableRow">
                <el-form-item
                  label="项目"
                  prop="fProjectid"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fProjectid"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
                <el-form-item
                  label="微信"
                  prop="fWechat"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fWechat"
                    autocomplete="off"
                  ></el-input>
                </el-form-item>
              </div>
              <div class="tableRow" style="margin-top: 10px">
                <el-form-item
                  label="备注"
                  prop="fNote"
                  :label-width="formLabelWidth"
                >
                  <el-input
                    v-model="formData.fNote"
                    type="textarea"
                    :rows="4"
                    placeholder="请输入内容"
                    autocomplete="off"
                  >
                  </el-input>
                </el-form-item>
              </div>
              <el-form-item class="newlyAdded_btn">
                <el-button type="primary" @click="submitForm2('formData')"
                  >保存</el-button
                >
                <el-button type="warning" @click="resetForm2('')"
                  >关闭</el-button
                >
              </el-form-item>
            </el-form>
          </div>
        </el-dialog>
      </div>
    </div>
  </div>
</template>

<script>
import {
  getBaseCompanyList,
  getBaseDepartmentList,
  getBasePostList,
  getBaseUserPageList,
  addBaseUser,
  getBaseUserByFid,
  delBaseUser,
  getExistAccount,
} from "@/api/request.js";
import tree from "@/components/public/common-trees";

export default {
  inject: ["reload"],
  name: "Home",
  components: {
    tree,
  },
  data() {
    return {
      name: "user",
      lr_add: null,
      lr_edit: null,
      lr_delete: null,
      userInfo: null,
      highlightBd: true,
      treelength: false,
      checkData: [],
      newpwd: "", //加密密码
      fDepartmentName: null,
      checked: false, //查看下级
      showName: "未选择公司",
      dialogHeight: "",
      loading: false,
      dialogFormVisible: false,
      formLabelWidth: "70px",
      tableData: [], //表格数据列表
      gender: [{ fGenderText: "男" }, { fGenderText: "女" }],
      treeDatas: null,
      // 表格
      fGender: "",
      // 新增
      dialogCheckVisible: false, //弹窗的显示隐藏
      loadingCheckDialog: false,
      ruleForm: {
        fUserid: "", //用户id
        fEncode: "", //用户编码
        fAccount: "", //登录名
        fPassword: "", //密码    md5转小写加密
        fRealname: "", //用户姓名
        fGender: "", //性别 0女 1男
        fHeadicon: "", //头像 id
        fBirthdays: "", //生日
        fMobile: "", //手机
        fWechat: "", //微信
        fDing: "", //钉钉
        fProjectid: "", //项目id
        fCompanyid: "", //机构id
        fDepartmentid: "", //部门id
        fPostid: "", //岗位id
        fEnabledmark: "", //用户状态  1正常  0锁定
        fNote: "", //备注
      },
      rules: {
        fAccount: [{ required: true, message: "请输入账号", trigger: "blur" }],
        fRealname: [{ required: true, message: "请输入姓名", trigger: "blur" }],
        fPassword: [
          {
            required: true,
            message: "请输入长度为6-12位密码",
            trigger: "blur",
          },
          {
            pattern:
              "^(?![A-Za-z0-9]+$)(?![a-z0-9\\W]+$)(?![A-Za-z\\W]+$)(?![A-Z0-9\\W]+$)[a-zA-Z0-9\\W]{6,12}$",
            message: "密码格式不正确",
          },
        ],
        fDepartmentid: [{ required: true, message: "请选择", trigger: "blur" }],
        fGender: [{ required: true, message: "请选择", trigger: "blur" }],
        fPostid: [{ required: true, message: "请选择", trigger: "blur" }],
      },
      rules1: {
        fAccount: [{ required: true, message: "请输入账号", trigger: "blur" }],
        fRealname: [{ required: true, message: "请输入姓名", trigger: "blur" }],
        fPassword: [
          { required: true, message: "请输入密码", trigger: "blur" },
          // { pattern: /(?=.*[a-zA-Z])(?=.*[0-9])(?=.*[\W]).{6,8}/, message: '密码格式不正确' }
        ],
        fDepartmentid: [{ required: true, message: "请选择", trigger: "blur" }],
        fGender: [{ required: true, message: "请选择", trigger: "blur" }],
        fPostid: [{ required: true, message: "请选择", trigger: "blur" }],
      },

      // 编辑
      fUserid: "",
      loadingDialog: false,
      dialogTableVisible: false,
      prohibit: true, //禁止编辑
      formData: {
        fUserid: "", //用户id
        fEncode: "", //用户编码
        fAccount: "", //登录名
        fPassword: "", //密码    md5转小写加密
        fRealname: "", //用户姓名
        fGender: "", //性别 0女 1男
        fHeadicon: "", //头像 id
        fBirthdays: "", //生日
        fMobile: "", //手机
        fWechat: "", //微信
        fDing: "", //钉钉
        fProjectid: "", //项目id
        fCompanyid: "", //机构id
        fDepartmentid: "", //部门id
        fPostid: "", //岗位id
        fEnabledmark: "", //用户状态  1正常  0锁定
        fNote: "", //备注
      },
      row: null,
      // 左侧机构树
      treeCompanyid: "",
      treeData: [], //左侧树
      companyTree: "", //所有数据
      defaultProps: {
        children: "children",
        label: "fShortname",
      },
      dialogVisible: false,
      // 部门
      departmentList: [],
      fDepartmentid: "",
      // 岗位
      postList: [],
      // 分页
      queryCriteriaData: {},
      navigatepageNums: null, //是否显示分页
      queryCriteria: {
        fCompanyid: "", //机构id
        fDepartmentid: "", //部门id
        fPostid: "", //岗位id
        keyWord: "", //模糊查询字段
        page: 1, //页码
        pageSize: 20, //每页条数
      },
    };
  },
  computed: {
    hIndex() {
      // 当前页数 - 1 * 每页数据条数 + 1
      return (this.queryCriteria.page - 1) * this.queryCriteria.pageSize + 1;
    },
  },
  mounted() {
    this.getHeight();
    if (JSON.parse(sessionStorage.getItem("monitorBack-SysManageManage_treeCheck"))) {
      var id = JSON.parse(sessionStorage.getItem("monitorBack-SysManageManage_treeCheck"));
      this.checkData = [id.fCompanyid];
    }
    this.getTree();
    this.btnRole(this.name);
    this.userInfo = JSON.parse(sessionStorage.getItem("monitorBack-userInfo"));
  },

  methods: {
    btnRole(name) {
      var btnList = [];
      var ModuleList = JSON.parse(sessionStorage.getItem("monitorBack-ModuleList"));
      if (ModuleList.length > 0) {
        ModuleList.map((item) => {
          if (item.fEncode == name) {
            btnList = item.modulebuttonList;
          }
        });
        var btnStr = [];
        btnList.map((item) => {
          btnStr.push(item.fEncode);
        });
        this.lr_add = btnStr.includes("lr_add");
        this.lr_edit = btnStr.includes("lr_edit");
        this.lr_delete = btnStr.includes("lr_delete");
      } else {
        this.lr_add = true;
        this.lr_edit = true;
        this.lr_delete = true;
      }
    },
    // 左侧树结构
    getTree() {
      getBaseCompanyList({})
        .then((res) => {
          if (res.errcode == 0) {
            var companyTree = res.data.baseCompanyList;
            this.treeData = this.commonJs.tranListToTreeData(companyTree);

            if (this.treeData[0].children == undefined) {
              this.treelength = false; //左侧组织机构是否显示
            } else {
              this.treelength = true;
            }

            if (
              JSON.parse(sessionStorage.getItem("monitorBack-SysManageManage_treeCheck"))
            ) {
              let id = JSON.parse(
                sessionStorage.getItem("monitorBack-SysManageManage_treeCheck")
              );
              this.queryCriteria.fCompanyid = id.fCompanyid;
              this.showName = id.fShortname; //顶部显示机构名
              this.treeCompanyid = id.fCompanyid;
              this.checkData[0] = id.fCompanyid;
            } else {
              this.queryCriteria.fCompanyid = this.treeData[0].fCompanyid;
              this.showName = this.treeData[0].fShortname; //顶部显示机构名
              this.treeCompanyid = this.treeData[0].fCompanyid;
              this.checkData[0] = this.treeData[0].fCompanyid;
            }

            this.getDataList(); //列表
            this.department(this.queryCriteria.fCompanyid); //获取部门
            this.post(this.queryCriteria.fCompanyid); //岗位
          } else {
            this.$message.error("获取组织机构失败", res.msg);
            return false;
          }
        })
        .catch(() => {
          console.log("获取组织机构失败");
          return false;
        });
    },

    // 点击左侧机构树
    handleNodeClick(data) {
      this.showName = data.fShortname; //顶部显示机构名
      this.treeCompanyid = data.fCompanyid;
      this.treeDatas = data;
      this.queryCriteria.fCompanyid = this.treeCompanyid;
      this.queryCriteria.fDepartmentid = "";
      this.queryCriteria.keyWord = "";
      this.getDataList(); //获取列表
      this.department(this.treeCompanyid); //获取部门
      this.post(this.treeCompanyid); //岗位
    },
    // 获取部门
    department(id) {
      getBaseDepartmentList({ fCompanyid: id })
        .then((res) => {
          if (res.errcode == 0) {
            this.departmentList = res.data.baseDepartmentList; //获取部门
          } else {
            this.$message.error("获取部门", res.msg);
          }
        })
        .catch(() => {
          console.log("获取部门接口报错");
        });
    },
    // 获取岗位
    post(id) {
      getBasePostList({ fCompanyid: id })
        .then((res) => {
          if (res.errcode == 0) {
            this.postList = res.data.basePostList; //获取部门
          } else {
            this.$message.error("获取岗位", res.msg);
          }
        })
        .catch(() => {
          console.log("获取岗位接口报错");
        });
    },
    // 通过部门过滤
    filterDepartment(id) {
      this.queryCriteria.fDepartmentid = id;
      this.getDataList();
    },
    // 页面切换
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.queryCriteria.page = val;
      this.getDataList();
    },
    // 获取列表数据
    getDataList() {
      this.loading = true;
      this.fUserid = "";
      getBaseUserPageList(this.queryCriteria)
        .then((res) => {
          if (res.errcode == 0) {
            var that = this;
            that.loading = false;
            this.queryCriteriaData = res.data.baseUserList;
            this.navigatepageNums =
              this.queryCriteriaData.navigatepageNums.length;
            that.tableData = this.queryCriteriaData.list;
            for (let index = 0; index < that.tableData.length; index++) {
              const element = that.tableData[index];
              if (element.fGender == 0) {
                element.fGender = "女";
              } else if (element.fGender == 1) {
                element.fGender = "男";
              }

              if (element.fEnabledmark == 0) {
                element.fEnabledmark = "锁定";
              } else if (element.fEnabledmark == 1) {
                element.fEnabledmark = "正常";
              }
            }

            setTimeout(() => {
              that.$nextTick(() => {
                that.$refs.multipleTable.doLayout();
              });
            }, 200);
          } else {
            this.$message.error("列表数据", res.msg);
            this.loading = false;
          }
        })
        .catch((error) => {
          console.log("获取列表数据接口报错", error);
          this.loading = false;
        });
    },
    // 新增
    newDetail(id) {
      this.ruleForm = {
        fUserid: "", //用户id
        fEncode: "", //用户编码
        fAccount: "", //登录名
        fPassword: "", //密码    md5转小写加密
        fRealname: "", //用户姓名
        fGender: "", //性别 0女 1男
        fHeadicon: "", //头像 id
        fBirthdays: "", //生日
        fMobile: "", //手机
        fWechat: "", //微信
        fDing: "", //钉钉
        fProjectid: "", //项目id
        fCompanyid: this.checkData[0], //机构id
        fDepartmentid: "", //部门id
        fPostid: "", //岗位id
        fEnabledmark: "", //用户状态  1正常  0锁定
        fNote: "", //备注
      };
      if (id != "" && id != null) {
        this.dialogCheckVisible = true;
        this.ruleForm.fCompanyid = this.treeDatas.fCompanyid;
      } else {
        this.$message.error("请先选择机构组织");
        return false;
      }
    },
    // 新增保存
    submitForm(formName) {
      var that = this;
      that.$refs.ruleForm.validate((valid) => {
        that.newpwd = that.$md5(that.ruleForm.fPassword.toLowerCase()); //密码加密
        that.ruleForm.fPassword = that.newpwd;

        if (that.ruleForm.fGender == "女") {
          that.ruleForm.fGender = 0;
        } else if (that.ruleForm.fGender == "男") {
          that.ruleForm.fGender = 1;
        }
        if (valid) {
          this.loadingCheckDialog = true;
          getExistAccount({ fAccount: that.ruleForm.fAccount })
            .then((res) => {
              if (res.errcode == 0) {
                if (res.data.isExist) {
                  that.$message.error("账戶名重复 请重新输入");
                  that.$refs[formName].resetFields();
                  that.loadingCheckDialog = false;
                  return false;
                } else {
                  addBaseUser(that.ruleForm).then((resTwo) => {
                    if (resTwo.errcode == 0) {
                      this.loadingCheckDialog = false;
                      this.dialogCheckVisible = false;
                      // this.reload();
                      // 卡卡5
                      this.getDataList();
                      // this.getTree();
                      // 卡卡5
                      that.$message.success("新增成功");
                    }
                  });
                }
              } else {
                this.$message.error("新增失败", res.msg);
                this.loadingCheckDialog = false;
              }
            })
            .catch(() => {
              console.log("账戶名重复");
              this.loadingCheckDialog = false;
            });
        } else {
          if (that.$refs.ruleForm.fields[2].validateState == "error") {
            that.$message.error(
              "密码必须由大写字母、小写字母、数字、特殊字符组成"
            );
            return false;
          } else {
            that.$message.error("请填写必填项");
            return false;
          }
          // validateState
        }
      });
    },

    // 重置
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
    // 编辑
    editText(id) {
      if (id != "") {
        this.dialogTableVisible = true;
        this.loadingDialog = true;
        getBaseUserByFid({ fUserid: id })
          .then((res) => {
            if (res.errcode == 0) {
              var that = this;
              that.dialogTableVisible = true;
              this.loadingDialog = false;
              var newList = res.data.lrBaseUser;
              if (newList.fGender == 0) {
                newList.fGender = "女";
              } else if (newList.fGender == 1) {
                newList.fGender = "男";
              }

              that.formData = newList;
            } else {
              this.$message.error("编辑", res.msg);
              this.loadingDialog = false;
            }
          })
          .catch(() => {
            console.log("详情接口报错");
            this.loadingDialog = false;
          });
      } else {
        return this.$message.error("请先选择 需要编辑的用户");
      }
    },

    //  确认修改：
    submitForm2() {
      var that = this;
      that.$refs.formData.validate((valid) => {
        if (valid) {
          if (that.formData.fGender == "女") {
            that.formData.fGender = 0;
          } else if (that.formData.fGender == "男") {
            that.formData.fGender = 1;
          }
          this.loadingDialog = true;

          addBaseUser(that.formData)
            .then((resTwo) => {
              if (resTwo.errcode == 0) {
                that.dialogTableVisible = false;
                that.loadingDialog = false;
                // 卡卡5
                that.getDataList();
                // that.getTree();
                // 卡卡5
                that.$message.success("修改成功");
              } else {
                that.$message.success("修改失败", resTwo.msg);
                this.loadingDialog = false;
              }
            })
            .catch(() => {
              console.log("修改失败");
              this.loadingDialog = false;
            });
        } else {
          that.$message.error("请填写必填项");
          return false;
        }
      });
    },
    // 关闭
    resetForm2() {
      this.dialogTableVisible = false;
    },
    // 点击当前行
    getRowInfo(e) {
      this.row = e;
      this.fUserid = e.fUserid;
    },
    // 点击当前行变色
    rowChange(val) {
      this.currentRow = val;
    },

    // 获取页面容器高度
    getHeight() {
      var h = document.documentElement.clientHeight; //获取页面可见高度
      this.dialogHeight = h * 0.4 + "px";
    },

    // 删除
    rowDelete(id) {
      if (id != "") {
        this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.loading = true;
            delBaseUser({ fUserid: id })
              .then((res) => {
                if (res.errcode == 0) {
                  this.loading = false;
                  // this.reload();
                  // 卡卡4
                  this.getDataList();
                  // this.getTree();
                  // 卡卡4
                  this.$message.success("删除成功");
                } else {
                  this.$message.error("删除失败", res.msg);
                  this.loading = false;
                  return false;
                }
              })
              .catch(() => {
                console.log("删除失败");
                this.loading = false;
              });
          })
          .catch(() => {
            this.$message("取消删除");
          });
      } else {
        return this.$message.error("请先选择需要删除的部门");
      }
    },
  },
};
</script>

<style scoped>
.printTables {
  background: #fff;
  display: flex;
  justify-content: end;
  padding: 5px;
  margin-top: 10px;
}

.dialogBody {
  padding: 3px 20px;
  height: 80%;
  overflow-y: auto;
}

a {
  text-decoration: none;
  color: #000;
}
</style>
